﻿@{
    ViewBag.Title = "Quản lý bài viết";
    Layout = "~/Views/Shared/FE/_Layout_FE_Index.cshtml";
}

<script src="@Url.Content("~/Scripts/BE/modernizr-1.7.min.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/validationEngine/jquery.validationEngine.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/validationEngine/jquery.validationEngine-en.js")" type="text/javascript"> </script>

<script src="@Url.Content("~/Scripts/BE/syntaxhighligher/shCore.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/syntaxhighligher/shBrushJScript.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/syntaxhighligher/shBrushXml.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/syntaxhighligher/shBrushCSharp.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/syntaxhighligher/shBrushSql.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/BE/jtablesite.js")" type="text/javascript"> </script>
<link href="@Url.Content("~/Scripts/BE/jtable/themes/standard/blue/jtable_blue.css")" rel="stylesheet"
      type="text/css" />    
<script type="text/javascript" src="@Url.Content("~/Scripts/BE/jtable/jquery.jtable.js")"> </script>
<link href="@Url.Content("~/Content/FE/Addition.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Scripts/BE/validationEngine/validationEngine.jquery.css")" rel="stylesheet" type="text/css" />

<style type="text/css">
    .searchText {
        background: none repeat scroll 0 0 padding-box rgba(255, 255, 255, 0.9);
        border-color: rgba(23, 51, 78, 0.15) rgba(23, 51, 78, 0.17) rgba(23, 51, 78, 0.2);
        border-radius: 4px 4px 4px 4px;
        height: 33px;
        padding: 2px;
        width: 180px;
    }

    .EditArticle:hover {
        font-weight: bold;
        cursor: pointer;
    }
    .classactive {
        color: white;
        text-shadow: none;
    }
</style>
<script type="text/javascript">
    $(document).ready(function () {
        $('#article-mng').click(function () {
            $('#category-mng').removeClass('classactive');
            $(this).addClass('classactive');
            $('#ArticleTable').show();
            $('#CategoryTable').hide(); 
        });
        $('#category-mng').click(function () {
            $('#article-mng').removeClass('classactive');
            $(this).addClass('classactive');
            $('#ArticleTable').hide();
            $('#CategoryTable').show();
        });
    });
</script>
<div class="allhome" style="padding-top: 15px;">
    <div id="menu" class="boxMod">
        <button id="article-mng" class="btn classactive">Danh sách bài viết</button>
        <br class="spacer" />
    </div>
    <div id="ArticleTable" style="border: 1px solid rgba(119, 79, 56, 0.4);"></div>
    
    <br class="spacer"/>
</div>
<script type="text/javascript">

    $(document).ready(function() {

        //Prepare jtable plugin
        $('#ArticleTable').jtable({
            selecting: true, //Enable selecting
            multiselect: false, //Allow multiple selecting
            selectingCheckboxes: true, //Show checkboxes on first column
            openChildAsAccordion: true,
            sorting: true,
            paging: true,
            pageSize: 20,
            columnResizable: false,
            defaultSorting: 'CreatedTime DESC',
            title: 'Danh sách các bài viết',
            actions: {
                listAction: '@Url.Action("ListArticle", "ArticleManagement")',
                deleteAction: '@Url.Action("DeleteArticle", "ArticleManagement")'
                //updateAction: '#',
                //createAction: '#'
            },
            fields: {
                ArticleID: {
                    key: true,
                    create: false,
                    edit: false,
                    list: false
                },
                ArticleTitle: {
                    title: 'Tiêu đề',
                    width: '45%',
                    create: false,
                    listClass: 'EditArticle'
                },
                CategoryName:
                    {
                        title: 'Chuyên mục',
                        width: '25%',
                        create: false
                    },
                CreatedTime: {
                    title: 'Ngày gửi',
                    type: 'date',
                    displayFormat: 'dd-mm-yy',
                    create: false
                }
            },
            recordsLoaded: function(event, data) {
                $('.EditArticle').each(function() {
                    var justdata = $(this).text().split(';');
                    var aid = justdata[justdata.length - 1].trim();
                    var text = "";
                    for (var i = 0; i < justdata.length - 1; i++) {
                        text = text + justdata[i];
                    }
                    $(this).addClass(aid);
                    $(this).html(text);
                });
                $('.EditArticle').live("click", function() {
                    var check = $(this).attr("class").split(' ');
                    var aid = check[check.length - 1].trim();
                    var url = '@Url.Action("Edit")' + "/" + aid.trim();
                    $(location).attr('href', url);
                });
            }
        });
        //
        
        //Re-load records when user click 'load records' button.
        $('#LoadRecordsButton').click(function(e) {
            e.preventDefault();
            $('#ArticleTable').jtable('load', {
                keywords: $('#name').val(),
            });
        });
        //
        //Delete selected students
        $('#DeleteAllButton').button().click(function() {
            var $selectedRows = $('#ArticleTable').jtable('selectedRows');
            $('#ArticleTable').jtable('deleteRows', $selectedRows);
        });

        //Load person list from server
        $('#ArticleTable').jtable('load');
    });
</script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#ArticleTable #DeleteAllButton').replaceWith('<a role="button" style="float: left;text-decoration: none; color: black;" class="modibutton" type="submit" href="@Url.Action("Create", "Article")">' +
            '<span>Tạo bài mới</span></a>');
        $('#ArticleTable #LoadRecordsButton').removeClass().addClass('modibutton');
//        $('#CategoryTable #DeleteAllButton').remove();
//        $('#CategoryTable #LoadRecordsButton').removeClass().addClass('modibutton');
//        $('#CategoryTable').remove();
    });
</script>
